import { StyleSheet } from "react-native";

const styles = StyleSheet.create({
  chatItem: {
    flexDirection: "row",
    alignItems: "center",
    padding: 16,
    position: "relative",
  },
  radioBtn: { marginRight: 5 },
  avatar: { width: 48, height: 48, borderRadius: 24 },
  chatContent: { flex: 1, marginLeft: 12 },
  chatHeader: {
    flexDirection: "row",
    alignItems: "center",
    alignContent: "center",
  },
  chatName: { fontSize: 16, fontWeight: "bold" },
  chatTime: {
    marginLeft: "auto",
    fontSize: 12,
  },
  unreadContainer: {
    borderRadius: 10,
    height: 20,
    minWidth: 20,
    paddingHorizontal: 5,
    justifyContent: "center",
    alignItems: "center",
    position: "absolute",
    right: 16,
    top: "50%",
    transform: [{ translateY: -10 }],
  },
  unreadCount: {
    fontSize: 12,
    fontWeight: "bold",
  },
  pinText: {
    fontSize: 12,
    marginBottom: 2,
    alignSelf: "center",
    alignItems: "center",
    marginLeft: 4,
  },
});

export default styles;
